@import '../../static/style/theme/color_theme'
.padding_header
    padding: 30px 20px 20px 20px
    border-bottom: 2px solid $color_dcdc
    position: relative

.week_rate_container
    padding: 20px 20px

    .week_rate
        width: 50%
        padding-right: 20px

    .week_nav
        width: 50%
        padding-left: 20px

.split_middle_container
    display: flex
    width: 100%
    justify-content: space-around

    .split_middle_left
        width: 50%
        flex: 1
        padding: 20px 20px
        box-sizing: border-box
    .split_middle_right
        width: 50%
        flex: 1
        padding: 20px 20px
        box-sizing: border-box

.none_border_container
    padding: 20px

.switch_wrapper
    padding: 16px 20px 2px 20px

.search_title
    font-size: 17px
    font-weight: bolder
    color: $color_3333
.switch_container
    padding-top: 10px
    align-items: center
    &:nth-child(3)
        padding-top: 15px
    &:last-child
        padding-top: 5px

    dl
        display: flex
        dt
            color: $color_6666
            padding: 2px 13px
            border: 1px solid $color_bfbf
            border-radius: 4px
            margin-right: 10px
            cursor: pointer
            box-sizing: border-box
            min-width: 60px
            text-align: center

        dd
            color: $color_6666
            padding: 2px 13px
            border: 1px solid $color_bfbf
            border-radius: 4px
            margin-right: 10px
            cursor: pointer
            box-sizing: border-box
            margin-bottom: 0
            min-width: 60px
            text-align: center
            position: relative
            overflow: hidden
            transition: all 0.3s

            &:before
                position: absolute
                content: ''
                width: 14px
                height: 14px
                background: $color_ffff
                top: -6px
                right: -6px
                border-radius: 100%
                transition: all 0.3s

        .dt_select
            background: $color_b2d9
            border: 1px solid $color_b2d9
    .flex_wrap_none
        flex-wrap: wrap
        dt
            margin-bottom: 10px
        dd
            margin-bottom: 10px

    .switch_content_tit
        display: block
        min-width: 70px
        text-align: right
        font-weight: bold

.flex_align_start
    align-items: flex-start

.tab_container
    padding: 20px 20px

.anchor_container
    min-width: 240px
    max-width: 240px
    margin-right: 30px
    border: 1px solid $color_eeee
    padding-bottom: 30px
    padding-left: 0 !important
    margin-left: 0 !important

    .ant-anchor-ink:global
        &:before
            width: 1px
            background-color: $color_eeee

.anchor_content
    p
        line-height: 1.8
        font-size: 14px
        text-indent: 28px
        padding: 0 10px
        text-align: justify

.charts_item_bg
    padding: 20px
    background: #fff
    .charts_title
        display: flex
        justify-content: space-between
        padding: 10px
        border-bottom: 1px solid #ccc
        .strong
            font-size: 16px
            margin-left: 30px
            color: #333
            &::before
                position: absolute
                height: 16px
                width: 4px
                background: $color_35a4
                content: ''
                left: 30px
                bottom: 3px
    .correlation
        width: 100%
        .correlation_item
            width: 50%
            padding: 10px

.positions_info
    width: 100%
    height: 100%
    overflow: auto
    position: relative
    padding: 100px 20px 20px 20px
    background: #fff
.hold_btn
    width: 220px
    margin: 0px auto 20px
    color: $color_ff69
    height: 54px
    text-align: center
    font-size: 18px
    box-sizing: border-box
    line-height: 40px
    position: absolute
    top: 47px
    left: 50%
    transform: translate(-50%, 0)
    background: url('../../static/img/title_bg_m.png') repeat-x center center
    background-size: 100% 100%
    &::before
        position: absolute
        content: ''
        left: -40px
        background: url('../../static/img/title_bg_l.png') no-repeat center right
        height: 100%
        width: 40px
        background-size: auto 100%

    &::after
        position: absolute
        content: ''
        right: -40px
        background: url('../../static/img/title_bg_r.png') no-repeat center left
        height: 100%
        width: 40px
        background-size: auto 100%
    span
        margin-left: -10px
        font-size: 24px
        padding-right: 16px


.positions_height
    height: 30px
    width: 100%
    border-bottom: 1px solid #f0f2f5
    margin-top: -80px

.contract_content
    width: 100%

.position_relative
    position: relative
    height: 30px
    background: $color_ffff
    .hold_btn
        top: -3px

.future_right
    width: 50%
    padding-left: 10px
    box-sizing: border-box
.future_left
    width: 50%
    padding-right: 10px
    box-sizing: border-box

.correlation_table_performance thead tr th
    text-align: center
    border: 1px solid #e8e8e8 !important
.correlation_table_performance table tbody tr td
    padding: 0
    text-align: center
    border: 1px solid #e8e8e8 !important
    span
        padding: 16px 0
        display: block
